var _Container = require('component/container.js');
var _inherit = require('core/inherit.js');
var _global = require('game/global.js');
var R = require('game/texture.js').R;
var _layout = require('tools/layout.js');
var _relative = _layout.relative;
var _vec3f = require('core/glm.js').vec3f;
var _Progress = require('scenes/widget/roundprogress.js');

function enlarge(size, w, h) {
    var s = new _vec3f(size);
    if (arguments.length == 2) {
        s.add(w);
    } else {
        s[0] += w;
        s[1] += h;
    }
    return s;
}

// ==========================
// GrowthProgress
// ==========================
function GrowthProgress() {
    _Container.call(this);

    var bg = _global.spriteNode(R.game.goals.growth);
    this.addChild(bg);
    this.setSize(bg.getSize());

    var frame = _global.spriteFrame(R.widget.progress);
    this.addChild(this.mProgress = new _Progress(_global.material.positionTexture(frame), frame));
    this.mProgress.setScale(0.433);
    this.mProgress.setPercent(0.67);
    _relative.local.layoutTo(this.mProgress, 0.5, 0, this, 0.5, 0, 1, 10);
}
_inherit(GrowthProgress, _Container);
GrowthProgress.prototype.setPercent = function (p) {
    this.mProgress.setPercent(p);
};

// ==========================
// CollectView
// ==========================
function ItemCount(collect) {
    _Container.call(this);

    this.mModel = collect;
    var bg = _global.spriteNode(R.game.goals['goals_' + collect.length]);
    this.setSize(bg.getSize());
    this.addChild(bg);
}
_inherit(ItemCount, _Container);

// ==========================
// CollectView
// ==========================
function CollectView(collect) {
    _Container.call(this);

    this.mModel = collect;
    var bg = _global.spriteNode(R.game.goals['col_bg_' + collect.length]);
    this.setSize(bg.getSize());
    this.addChild(bg);

    this.addChild(this.mProgress = new GrowthProgress());
    this.addChild(this.mItemBg = new ItemCount(collect));

    _relative.local.layoutTo(this.mProgress, 0.5, 1, this, 0.5, 1, 0, -11);
    _relative.local.layoutTo(this.mItemBg, 0.5, 0, this, 0.5, 0, 0, 9);
}
_inherit(CollectView, _Container);

// ==========================
// GrowthPanel
// ==========================
function MoveLeft() {
    _Container.call(this);
    var bg = _global.spriteNode(R.game.goals.moveleft);
    this.addChild(bg);
    this.setSize(bg.getSize());
}
_inherit(MoveLeft, _Container);

// ==========================
// GrowthPanel
// ==========================
function GrowthPanel(model) {
    _Container.call(this);

    this.mModel = model;
    this.addChild(this.mCollect = new CollectView(model.collect));
    this.addChild(this.mMoveLeft = new MoveLeft());

    this.setSize(enlarge(this.mCollect.getSize(), 0, this.mMoveLeft.getSize()[1] - 12));

    _relative.local.layoutTo(this.mCollect, 0.5, 1, this, 0.5, 1);
    _relative.local.layoutTo(this.mMoveLeft, 0.5, 0, this, 0.5, 0);
}
_inherit(GrowthPanel, _Container);

module.exports = GrowthPanel;